<template>
	<view class="Recharge_content">
		<view class="center_content">
			<view class="back key_back transcation">
				<image src="../../static/image/key_back.png" @tap="back"></image>
				<text style="color:rgba(194,201,223,1)">{{i18n.keyback1}}</text>
				<!-- <view :style="i18n.keybackstyle">{{i18n.keyback1}}</view> -->
			</view>
			<view class="back key_back2">
				<view  :style="i18n.keybackstyle2" style="color:rgba(194,201,223,1)">{{i18n.keyback2}}</view>
			</view>
			
			<view class="rules">
				<text class="rules_title2">{{i18n.rulestitle1}}</text>
				<text class="rules_title">{{i18n.rulestitle2}}</text>
				<view class="rules_item">
					<image src="../../static/image/point.png"></image>
					<text>{{i18n.rules_item1}}</text>
				</view>
				<view class="rules_item">
					<image src="../../static/image/point.png"></image>
					<text>{{i18n.rules_item2}}</text>
				</view>
				<view class="rules_item">
					<image src="../../static/image/point.png"></image>
					<text>{{i18n.rules_item3}}</text>
				</view>
			</view>
			
			<image :src="i18n.keyimg1" class="unexport" @tap="back"></image>
			<image :src="i18n.keyimg2" class="export" @tap="exportKey"></image>
		</view>
		
		<view class="pwd_content" v-show="show">
			<view class="pwd_center">
				<view class="pwd_title">{{i18n.pwdtitle}}</view>
				<view class="enter_input">
					<input :type="eye?'text':'password'" style="font-size: 11px;color:#8687A3;padding-left: 20upx;" v-model="password" :placeholder="i18n.placeholder" placeholder-class="enter_placeholder" />
					<image
					:src="eye?'../../static/image/openeye_green.png':'../../static/image/closeeye.png'" 
					@tap="chageEye"
					class="eyes"></image>
				</view>
				<view class="btns">
					<view class="cancle_btn" @tap="cancel">
						<image :src="i18n.btn1" mode=""></image>
					</view>
					<view class="submit_btn" @tap="confirm">
						<image :src="i18n.btn2" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		
		<view class="export_key" v-show="showexport" >
			<view class="pwd_center">
				<view class="pwd_title">{{i18n.medcsy}}</view>
				<view class="tips">
					{{i18n.tips}}
				</view>
				<view class="key_content"  style="border-bottom: none;">
					{{privateKey}}
				</view>
				<view class="btns">
					<view  mode=""  @tap="close" class="closestyle">取消</view>
					<view  mode="" @tap="copy" class="copystyle">复制</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import { ethers } from 'ethers';
	import {myMixins} from '../../common/mixins.js'
	import Clipboard from 'clipboard';  
	import CryptoJS from 'crypto-js';
	import Files from '../../common/files.js'
	
	export default {
		computed: {
			i18n() {
				return this.$t('user')
			}
		},
		mixins: [myMixins], 
		data() {
			return {
				show: false,
				showexport:false,
				password:"",
				privateKey:"",
				eye:false
			}
		},
		methods: {
			chageEye(){
				this.eye = !this.eye;
			},
			exportKey(){
				//
				this.show = true;
			},
			back(){
				this.$CommonJS.navigateBack()
			},
			cancel(e){
					this.show = false;
					this.password = "";
					this.privateKey = "";
			},
			confirm(e){
				const _this = this;
				if(this.password == ""){
					_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '密码不能为空':'Password cannot be empty');
					return;
				}else{
					_this.show = false;
					uni.showLoading({
						title: _this._i18n.locale == 'zh_CN' ? "正在导出":'Exporting'
					})
					//读取文件
					Files.getFileData(_this.account_info.accountName).then(txt =>{
						//解密
							var bytes  = CryptoJS.AES.decrypt(txt, _this.password);
							const arr = bytes.words.filter(item =>{
								return Number(item) < 0
							})
							
							if(arr.length >= 1){
								uni.hideLoading()
								_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ?'密码错误': 'Password error');
								return;
							}else{
								var decryptedData = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
								if(decryptedData){
									uni.hideLoading()
									_this.showexport = true;
									_this.privateKey = decryptedData.privateKey;
								}else{
									uni.hideLoading()
									_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? "私钥丢失" :'The private key is missing');
								}
							}
							
							
							
							
							
					
					}).catch(err =>{
						console.log(err)
						uni.hideLoading()
						_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '读取keystore失败':'Failed to read keystore')
						
					})
					
				}
			},
			close(){
				this.showexport = false;
				this.privateKey = "";
				this.password = "";
			},
			copy(){
				//#ifdef APP-PLUS
				const _this = this;
				uni.setClipboardData({
					data:this.privateKey,
					success: function () {
							uni.showToast({
								title:_this._i18n.locale == 'zh_CN' ? '已复制':'Copied',
							})
					}
				})
				//#endif
				//#ifdef H5
				 var clipboard = new Clipboard(".tag-read");
				
	      clipboard.on("success", e => {
	       this.$CommonJS.showToast("复制成功")
	        // 释放内存
	        clipboard.destroy();
	      });
	      clipboard.on("error", e => {
	        // 不支持复制
	       this.$CommonJS.showToas("该浏览器不支持自动复制");
	        // 释放内存
	        clipboard.destroy();
	
	      });
				//#endif
			}
		}
	}
</script>

<style lang="stylus">
	@import "../../static/stylus/me/me.stylus"
</style>
